<script setup>
import PageContainer from "@/components/PageContainer.vue";
import Footer from "@/components/Footer.vue";
</script>

<template>
    <div class="brand-intro">
      <el-row>
        <el-col :span="2"></el-col>
        <el-col :span="8">
          <img src="@/assets/logo.png" alt="品牌logo" />
        </el-col>
        <el-col :span="12">
          <el-card>
            <h1>Runner's Sport</h1>
            <h3>Runner's Sport —— 跑者的天堂</h3>
            <p>在跑步的世界里，有这样一家商城，它的名字叫做Runner's Sport。这里
              ，不仅是一个购物的地点，更是一个跑步爱好者的聚集地，一个追求健康生活方式的社区。
            </p>
            <p>Runner's Sport商城创立于对跑步这项古老而简单运动的热爱之上。我们相信，跑步不仅是一种锻炼方式，它还是一种生活态度，
              一种不断挑战自我的精神。因此，我们的商城致力于为每一位跑者提供最专业的运动装备和最贴心的服务体验。
            </p>
            <p>
              走进商城，您会发现从专业跑鞋到功能性服装，从智能手表到营养补给，Runner's Sport涵盖了跑步所需的一切。我们的产品线坚持“科技、
              舒适、时尚”三大原则，力求让每一位顾客在选购时都能找到最适合自己的装备。
            </p>
            <p>
              除了丰富的产品选择，Runner's Sport还提供专业的咨询服务。无论您是初学者还是资深跑者
              ， 我们的顾问都能根据您的需求，为您推荐最适合的商品。
              此外，定期举办的跑步训练营和健康讲座，更是帮助跑友们提升技能，拓宽知识。
            </p>
            <p>
              在这里，每一次脚步的回响，都是对健康生活的热爱与追求。Runner's Sport不仅仅是一家商城，
              它是跑者们的起点，是他们不断超越自我的见证者。 我们相信，通过我们的助力，每一位跑者都能在这条跑道上，
              找到属于自己的节奏，享受奔跑带来的自由与快乐。
            </p>
            <p>
              今天，您准备好在Runner's Sport开始您的跑步之旅了吗？让我们一起，在这条无尽的跑道上
              ，留下坚定而优雅的足迹。
            </p>

          </el-card>

        </el-col>
        <el-col :span="2"></el-col>
      </el-row>
    </div>
  <div class="footer">
    <Footer style="width: 100%"></Footer>
  </div>

</template>



<style scoped>
.brand-intro {
  background-color: #FFFFFF;
}
.brand-intro img{
  height: 100px;
  width: 400px;
  margin-top: 300px;
}
.brand-intro h1 {
  font-size: 36px;
  margin-top: 20px;
}
.brand-intro p {
  font-size: 18px;
  line-height: 1.5;
  margin-top: 20px;
}
h1{
  text-align: center;
  text-shadow:0px 1px 0px #c0c0c0,
  0px 2px 0px #b0b0b0,
  0px 3px 0px #a0a0a0,
  0px 4px 0px #909090,
  0px 5px 10px rgba(0, 0, 0, .9);
}
h3{
  text-align: center;
  text-shadow:0px 1px 0px #c0c0c0,
  0px 2px 0px #b0b0b0,
  0px 3px 0px #a0a0a0,
  0px 4px 0px #909090,
  0px 5px 10px rgba(0, 0, 0, .9);
}
p {
  font-size: 30px;
  text-align: left;
  color:black;
  text-shadow:0px 1px 0px #c0c0c0,
  0px 2px 0px #b0b0b0,
  0px 3px 0px #a0a0a0,
  0px 4px 0px #909090,
  0px 5px 10px rgba(0, 0, 0, .9);
}
.footer{
   position: relative;
   right: 100px;
}
</style>
